<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>属性操作_值val</title>
		<script type="text/javascript" src="../js/jquery-1.11.0.js" ></script>
		<script>
			/**
			 * 需求：
			 *  1.点击按钮获得文本框、下拉框、单选框选中的value
			 *  2.点击按钮设置用户名的默认值为“老王”
			 */

			/**
			 * 方法分析
			 * 	1.val()方法用于读取元素value属性
			 * 	2.val(val)方法用于设置元素value属性
			 */
			
			/**
			 *代码实现 
			 */
			
			$(function(){
				//1.点击按钮获得文本框、下拉框、单选框选中的value
				$("#btn1").click(function(){
					alert($("#username").val());
					alert($("#city").val());
					alert($("input[type='radio']:checked").val());
				});
					
				//2.点击按钮设置用户名的默认值为“老王”
				$("#btn2").click(function(){
					$("#username").val("老王");
				});
			})
		</script>
	</head>

	<body>
		用户名 <input type="text" id="username" /> <br/> 
		性别 <input type="radio" name="gender" value="男" />男
			<input type="radio" name="gender" value="女" checked="checked"/> 女<br/> 
		城市
			<select id="city">
				<option value="北京">北京</option>
				<option value="上海">上海</option>
				<option value="广州">广州</option>
			</select> <br/>
			<input type="button" value="获取val" id="btn1" />
			<input type="button" value="设置val" id="btn2" />
	</body>

</html>